%!TeX root=book.tex
\chapter{Δείγματα της εφαρμογής}
  Όπως έχουμε αναλύσει και σε προηγούμενα κεφάλαια η εφαρμογή χωρίζεται σε 2 βασικά μέρη, αυτό που βλέπουν και αλληλεπιδρούν οι απλοί επισκέπτες και τα μέλη μιας εταιρείας και συγκεκριμένα στην περίπτωση μας τα μέλη ενός φροντιστηρίου. Και αυτό της σελίδας διαχείρισης μέσα από την οποία ο διαχειριστής της εφαρμογής έχει τη δυνατότητα να αλλάξει δυναμικά σχεδόν οποιοδήποτε ορατό περιεχόμενο του μέρους που βλέπουν τα μέλη καθώς και άλλες ρυθμίσεις που καθορίζουν την ομαλή λειτουργία του ιστότοπου. 
	\section{Frontend}	
		\subsection{Επισκέπτες}
		Το κομμάτι του Frontend είναι κατά ένα μεγάλο βαθμό κοινό τόσο για τους επισκέπτες όσο και για τα μέλη του ιστότοπου. Το ανώτερο μέλος αποτελείται από μια μπάρα που δίνει διάφορες συνδέσεις με κοινωνικά δίκτυα που δραστηριοποιείται η εταιρεία και τα οποία φυσικά είναι διαχειρίσιμα από το περιβάλλον διαχείρισης \ref{fig:socialImage}.
			\begin{figure}[h]
			  \centering
			  \includegraphics{images/social.png}
			  \caption{Σελίδες κοινωνικής δικτύωσης}
			  \label{fig:socialImage}
			\end{figure}
			
			Έπειτα υπάρχει η δυνατότητα αναζήτησης σε όλο το περιεχόμενο του ιστότοπου όπως ανακοινώσεις και γενικά άρθρα καθώς και σε περίπτωση συνδεδεμένου χρήστη και στο περιεχόμενο των μελών όπως μαθήματα, προσωπικά μηνύματα και ανακοινώσεις μαθημάτων \ref{fig:searchImage}.
			\begin{figure}[h]
			  \centering
			  \includegraphics{images/search.png}
			  \caption{Δυνατότητα αναζήτησης}
			  \label{fig:searchImage}
			\end{figure}		
			
			Αμέσως μετά υπάρχει το κυρίως μενού μέσα από το οποίο ο χρήστης μπορεί να περιηγηθεί στις πληροφορίες που τον ενδιαφέρουν όπως τελευταίες ανακοινώσεις ή επικοινωνία με την εταιρεία \ref{fig:menuImage}. Τα στοιχεία του μενού είναι πλήρως δυναμικά μέσα από ειδική σελίδα του περιβάλλοντος διαχείρισης. Έτσι ο διαχειριστής του ιστότοπου έχει την δυνατότητα να ορίσει πού θα τοποθετηθεί το κάθε στοιχείο καθώς και τη σειρά που θα εμφανίζεται.
			\begin{figure}[h]
			  \centering
			  \includegraphics{images/menu.png}
			  \caption{Κυρίως μενού}
			  \label{fig:menuImage}
			\end{figure}
				
			Η σελίδα των ανακοινώσεων προσφέρει άμεση πρόσβαση στις τελευταίες ανακοινώσεις της εταιρείας σε αντίστροφη χρονολογική σειρά, από την πιο πρόσφατη στην παλαιότερη. 
			\begin{center}
			  \includegraphics{images/news.png}
			  \captionof{figure}{Τελευταία νέα}
			  \label{fig:newsImage}
			\end{center}
			
		Για ευκολότερη και πιο άμεση ενημέρωση οι πληροφορίες αυτές είναι άμεσα ορατές και στην αρχική σελίδα του ιστότοπου \ref{fig:announcementsImage} \ref{fig:newsImage}.
			\begin{center}
			  \centering
			  \includegraphics{images/announcements.png}
			  \captionof{figure}{Ανακοινώσεις}
			  \label{fig:announcementsImage}
			\end{center}

			Σε ειδικό μέρος του ιστότοπου υπάρχει η δυνατότητα προβολής απόψεων από ικανοποιημένους μαθητές (ή γενικότερα πελάτες και συνεργάτες) σε συνδυασμό με την προαιρετική φωτογραφία τους μέσω της μεθόδου προβολής carousel, τα οποία καθορίζονται από τον διαχειριστή του ιστότοπου \ref{fig:testimonialsImage}.
			\begin{center}
			  \centering
			  \includegraphics{images/testimonials.png}
			  \captionof{figure}{Απόψεις}
			  \label{fig:testimonialsImage}
			\end{center}
			
			Όλοι οι χρήστες του ιστότοπου (μέλη και επισκέπτες) έχουν την δυνατότητα να στείλουν ένα μήνυμα προς την αρμόδια ομάδα της εταιρείας μέσα από την ειδική σελίδα επικοινωνίας στην οποία εμπεριέχεται η φόρμα που πρέπει να συμπληρώσουν οι ενδιαφερόμενοι ώστε να στείλουν το μήνυμα τους \ref{fig:contactImage}. 
			\begin{center}
			  \centering
			  \includegraphics{images/contact.png}
			  \captionof{figure}{Φόρμα επικοινωνίας}
			  \label{fig:contactImage}
			\end{center}
			
			Επίσης σε περίπτωση που επιθυμούν κάποιον κλασσικό τρόπο επικοινωνίας, υπάρχουν διαθέσιμες και όλες οι απαραίτητες πληροφορίες όπως τηλέφωνο, διεύθυνση και ταχυδρομικός κώδικας που φυσικά καθορίζονται από τον διαχειριστή \ref{fig:infoImage}.
			\begin{center}
			  \centering
			  \includegraphics{images/info.png}
			  \captionof{figure}{Στοιχεία επικοινωνίας}
			  \label{fig:infoImage}
			\end{center}

		\subsection{Μέλη}
		Εφόσον έχουν συνδεθεί μέσα από την ειδική φόρμα εισαγωγής ονόματος χρήστη και κωδικού \ref{fig:loginImage} τα μέλη της εταιρείας (στην περίπτωση μας οι μαθητές) μπορούν να αποκτήσουν πρόσβαση σε συγκεκριμένες υπηρεσίες όπως τα μαθήματα στα οποία συμμετέχουν \ref{fig:myCoursesImage}.
			\begin{center}
			  \centering
			  \includegraphics{images/login.png}
			  \captionof{figure}{Φόρμα ταυτοποίησης μέλους}
			  \label{fig:loginImage}
			\end{center}
			
		Από εκεί μπορούν να δουν λεπτομέρειες για κάθε ένα μάθημα που παρακολουθούν  \ref{fig:courseImage} όπως και επίσης να μεταφορτώσουν σχετικά αρχεία με το συγκεκριμένο μάθημα \ref{fig:courseΑttachmentsImage}, τα οποία έχει καθορίσει ο διαχειριστής.
			\begin{center}
			  \centering
			  \includegraphics{images/my_courses.png}
			  \captionof{figure}{Ενδεικτική σελίδα μαθημάτων}
			  \label{fig:myCoursesImage}
			\end{center}

			\begin{center}
			  \centering
			  \includegraphics{images/programming.png}
			  \captionof{figure}{Ενδεικτικό μάθημα}
			  \label{fig:courseImage}
			\end{center}			
			
			\begin{center}
			  \centering
			  \includegraphics{images/course_attachments.png}
			  \captionof{figure}{Επισυναπτόμενα αρχεία μαθήματος}
			  \label{fig:courseΑttachmentsImage}
			\end{center}
			
		Σε κάθε περιήγηση σε ένα άρθρο ή κάποιο στοιχείο πέραν της αρχικής σελίδας υπάρχει μια διακριτική ένδειξη που δείχνει ιεραρχικά το σημείο το οποίο βρίσκεται ο χρήστης και την διαδρομή που ακολουθεί για να βρεθεί εκεί.
			\begin{center}
			  \centering
			  \includegraphics{images/breadcrumbs.png}
			  \captionof{figure}{Διαδρομή τρέχοντος καταλόγου}
			  \label{fig:courseΑttachmentsImage}
			\end{center}		
		

	\section{Περιβάλλον διαχείρισης}
	
	Το περιβάλλον διαχείρισης αφορά τα μέλη του ιστότοπου που έχουν δικαιώματα διαχειριστή. Θα πρέπει να έχουν συνδεθεί στον ιστότοπο χρησιμοποιώντας την ειδική φόρμα \ref{fig:loginImage} και όπως επίσης να εισάγουν την ειδική διεύθυνση στον φυλλομετρητή \ref{fig:adminPanelUrl} τους για να μπορέσουν να έχουν πρόσβαση στη περιοχή αυτή
	
	\begin{center}
		\centering
			\includegraphics{images/admin_url.png}
		\captionof{figure}{Ειδικό URL περιβάλλοντος διαχείρισης}
			\label{fig:adminPanelUrl}
	\end{center}
	
	Εκεί μπορούν να δουν την αρχική σελίδα του περιβάλλοντος διαχείρισης που περιλαμβάνει το ταμπλό διαχείρισης \ref{fig:adminPanelDashboard} όπου εκεί δίνετε στον διαχειριστή η γρήγορη πρόσβαση σε συνηθισμένες εργασίες που θα εκτελεί.
	
	\begin{center}
		\centering
			\includegraphics{images/admin_dashboard.png}
		\captionof{figure}{Ειδικό ταμπλό διαχείρισης}
			\label{fig:adminPanelDashboard}
	\end{center}
	
	Στα αριστερά μπορούμε να παρατηρήσουμε το διαχειριστικό μενού που περιλαμβάνει κατά ομάδες όλα τα περιεχόμενα του ιστότοπου μας που μπορούμε να διαχειριστούμε \ref{fig:adminPanelMenu}. Υπάρχουν βέλη σε μερικές κατηγορίες που υποδηλώνουν ότι η ομάδα αυτή μπορεί να επεκταθεί και να περιλαμβάνει περισσότερες πληροφορίες και επιλογές.
	
	\begin{center}
		\centering
			\includegraphics{images/admin_menu.png}
		\captionof{figure}{Μενού διαχειριστικού περιβάλλοντος}
			\label{fig:adminPanelMenu}
	\end{center}
	
	Μια από τις βασικές λειτουργίες που προσφέρει η διαχειριστική περιοχή είναι η διαχείριση των άρθρων (Articles) που υπάρχουν στον ιστοτοπο όπως και η δημιουργία νέου άρθρου. Η τελευταία λειτουργιά ειδικά είναι πολύ απλή καθώς όταν επιθυμούμε να γράψουμε ή να τροποποιήσουμε ένα άρθρο εμφανίζετε ειδικός κειμενογράφος \ref{fig:adminPanelArticles} ο οποίος προσφέρει πολλές επιλογές τροποποίησης κείμενου. 
	
	\begin{center}
		\centering
			\includegraphics{images/admin_new_article.png}
		\captionof{figure}{Ειδικός κειμενογράφος άρθρων}
			\label{fig:adminPanelArticles}
	\end{center}
	
	Η τροποποίηση και η προσθήκη μαθημάτων είναι ιδιαίτερα απλή καθώς λαμβάνει χώρα σε ένα ξεχωριστό κομμάτι της διαχειριστικής περιοχής όπου εμφανίζονται όλες οι διαθέσιμες επιλογές σε έναν διαχειριστικό πίνακα \ref{fig:adminPanelCourses}
	
	\begin{center}
		\centering
			\includegraphics{images/admin_courses.png}
		\captionof{figure}{Περιοχή μαθημάτων}
			\label{fig:adminPanelCourses}
	\end{center}
	
	Στην περίπτωση που ο διαχειριστής επιθυμεί να δημιουργήσει ή να τροποποιήσει τα τμήματα που υπάρχουν σε κάθε μάθημα υπάρχει η ανάλογη λειτουργιά οπού αφού πρώτα ο διαχειριστής βλέπει το γενικό σύνολο με όλα τα ήδη υπάρχοντα τμήματα \ref{fig:adminPanelClassroom} μπορεί να διαχειριστεί το καθένα ξεχωριστά ανάλογα την επιθυμία του.
	
	\begin{center}
		\centering
			\includegraphics{images/admin_classrooms.png}
		\captionof{figure}{Τμήματα μαθημάτων}
			\label{fig:adminPanelClassroom}
	\end{center}
	
	Υπάρχει η δυνατότητα τροποποίησης της περιοχής διαφανειών που έχουμε στην αρχική σελίδα του ιστότοπου μας. Προσβάσιμη από το αριστερό μενού του περιβάλλοντος διαχείρισης μας οδηγεί σε έναν πίνακα \ref{fig:adminPanelSlideshow} που περιλαμβάνει όλες τις υπάρχουσες διαφάνειες και μας δίνει πλήρη δικαιώματα πάνω τους.
	
	\begin{center}
		\centering
			\includegraphics{images/admin_slideshow.png}
		\captionof{figure}{Διαχείριση περιοχής διαφανειών}
			\label{fig:adminPanelSlideshow}
	\end{center}
	
	Η περιοχή πιστοποίησης είναι ακόμα μια περιοχή που εμφανίζεται στον ιστότοπο μας και έχουμε δυνατότητα τροποποίησης της. Προσβάσιμη από το μενού όπως εμφανίζεται στην \ref{fig:adminPanelMenu} οδηγεί σε έναν πίνακα    \ref{fig:adminPanelTestimonials} που μπορούμε να δούμε τα περιεχόμενα της αλλά και να κάνουμε ότι τροποποιήσεις επιθυμούμε.
	
	\begin{center}
		\centering
			\includegraphics{images/admin_testimonials.png}
		\captionof{figure}{Διαχείριση περιοχής πιστοποίησης}
			\label{fig:adminPanelTestimonials}
	\end{center}
	
	
	
